<template>
  <a-button type="link" style="padding: 4px 6px" @click="onClick">
    取消
  </a-button>
</template>
<script setup>
import { Form } from 'ant-design-vue'
import { useVModel } from '@vueuse/core'
import { useDataSourceManager, useLockForInUse } from './provide-context.js'
/**
 * 外部参数
 */
let props = defineProps({
  editing: { type: Boolean, default: () => false },
  data: { type: Object, required: true },
  rules: { type: Object, default: () => ({}) },
})
/**
 * 事件定义
 */
let emit = defineEmits(['update:editing'])
/**
 * 双向绑定
 */
let editing = useVModel(props, 'editing', emit)
/**
 * 全局
 */
let { removeEmpty } = useDataSourceManager()
let lockForInUse = useLockForInUse()
/**
 * 校验相关
 */
let useForm = Form.useForm
let { resetFields } = useForm(props.data, props.rules)

/**
 * 事件
 */
async function onClick() {
  if (props.data.new) {
    removeEmpty()
  } else {
    try {
      resetFields()
      editing.value = false
    } catch (e) {}
  }
  lockForInUse.value = null
}
</script>
